<template>
  <div class="student">
    <h1>姓名:{{ name }}</h1>
    <h1>年龄：{{ age }}</h1>

    <button @click="sendStudentName">点我获取学生名</button>
    <button @click="unbind">点我解绑事件</button>
  </div>
</template>

<script>
export default {
  name: 'Student',
  data() {
    return {
      name: '张无尽',
      age: 18,
    }
  },
  methods: {
    sendStudentName() {
      //触发Student组件实例身上的atguigu事件
      // const obj = {
      //   name: this.name,
      //   age: this.age,
      //   sex: 'female',
      // }
      // this.$emit('atguigu', JSON.stringify(obj))
      this.$emit('atguigu', this.name, 666, 888)
      this.$emit('demo')
    },
    unbind() {
      // this.$off('atguigu') //解绑单个事件
      this.$off(['atguigu']) //解绑多个事件
      // this.$off() //解绑所有事件
    },
  },
}
</script>

<style scoped>
.student {
  background-color: aliceblue;
}
</style>
